<template>
  <div class="buysuccesscontent">
    <div class="Commonreadsuccess">
      <div class="successicon"><img src="../../assets/img/ComreadBuysucess/invalid-name@3x.png" alt=""></div>
      <div class="successtitle">支付成功</div>
      <p class="subhead">
        共读开始时间为{{comstarttime}}<br>
        请及时邀请共读好友激活会员
      </p>
    </div>
    <div class="Commonread">
      <ul class="invitelist">
        <li v-for="item in items" :key="item.user_activity_id">
          <div class="invitetitle">{{item.vip_activity_name}}</div>
          <ul class="listli">
            <li v-for="child in item.childrenl" :key="child.invite_code_id">
              <div class="invitepartnername">{{child.activation_code}}</div>
              <div class="invitebtn" @click="showshare(child)">立即邀请</div>
            </li>
          </ul>
        </li>
      </ul>
      <div class="explain">
        <div class="exptitle">邀请码说明</div>
        <p class="exptext" v-html="illshtml">
        </p>
      </div>
    </div>
    <transition
      name="sharemode">
      <Share v-if="isshare" @hide="hideshare" :show="4"></Share>
    </transition>
  </div>
</template>

<script>

  export default {
    name: 'index',
    data: function () {
      return {
        items:[],
        isshare:false,
        comstarttime:'',
        illshtml:''
      }
    },
    props:['peoplenum'],
    mounted: function () {
      this.updata()
    },
    methods: {
      updata:function(){
        var paysuccessparms = {
          order_id:this.$route.query.order_id
          // order_id:'34154201051644810'
        }
        this.$axios.codes(paysuccessparms).then(res => {
          // 重新整理邀请码数据
          var newArr = [], uid, n = -1
          res.data.qing_data.list.map((item) => {
            if (uid === item.user_activity_id) {
              newArr[n].childrenl.push({invite_code_id: item.invite_code_id, activation_code: item.activation_code})
            } else {
              n++
              uid = item.user_activity_id
              newArr.push({
                user_activity_id: item.user_activity_id,
                vip_activity_name: item.vip_activity_name,
                childrenl: [{invite_code_id: item.invite_code_id, activation_code: item.activation_code}]
              })
            }
          })
          this.items = newArr
          this.comstarttime = res.data.qing_data.start
          res.data.qing_data.faq.split('|').map((item,index)=>{
            this.illshtml+=(index+1)+'. '+item+'<br>'
          })
        })
      },
      showshare: function (child) {
        var _this = this
        var shareparms = {
          post_id: child.invite_code_id,
          share_type: 28
        }
        this.$axios.share_link_info(shareparms).then(res => {
          var data = {
            title: res.data.qing_data.title,
            desc: res.data.qing_data.desc,
            link: res.data.qing_data.link,
            imgUrl: res.data.qing_data.img
          }
          var obj = {}
          obj.share_id = res.data.qing_data.share_id
          obj.share_token = res.data.qing_data.share_token
          this.$wx.ShareTimeline(data, res => {
            obj.share_mode = res.share_mode
            obj.share_type = 22
            _this.share_done(obj)
          })
          this.$wx.ShareAppMessage(data, res => {
            obj.share_mode = res.share_mode
            obj.share_type = 22
            _this.share_done(obj)
          })
        })
        this.isshare = true
      },
      share_done: function (obj) {
        this.$axios.share_done(obj).then(res => {
          this.isshare = false
          if (res.data.qing_code !== 100) {
            Toast({
              message: '分享失败',
              iconClass: 'iconfont icon-bangdingshibai',
              duration: 5000
            })
          } else {
            Toast({
              message: '分享成功',
              iconClass: 'iconfont icon-tianjiachenggong',
              duration: 5000
            })
          }
        })
      },
      hideshare: function () {
        this.isshare = false
      }
    },
    components: {
      Share: () => import('../../components/Share/index')
    }
  }
</script>

<style scoped>
  @import "../../assets/css/views/ComreadBuysucess/index.css";

</style>

